<!DOCTYPE HTML>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>我是一阵风直播</title>
    <link rel="stylesheet" type="text/css" href="../css/aui.css" />
    <style>
        #aui-header{position: fixed;z-index:999;}
        #home-main .aui-btn{background:none;}
        .aui-icon-camera{font-size:1rem;}
        .aui-btn-kk{padding: 15px;}
        .aui-row{background:#fff;}
        .aui-btn-title{margin-top:1rem;line-height:2rem;border-bottom:1px solid #ececec;}
        .aui-btn-fbl{padding: 5px;}
        .aui-btn-fbl .aui-btn-block{line-height:1rem;padding: inherit;}
        .aui-btn-fbl span{display:block;font-size:0.5rem;}
        .start-push{margin-top:1rem;}
        .create-room{margin-top:0.5rem;}
        .aui-btn-bot .aui-btn{width:90%;margin:0 auto;}
    </style>
</head>
<body>
    <header class="aui-bar aui-bar-nav" id="aui-header">
        <!-- <div class="aui-title">主播端首页</div> -->
    </header>
    <form action="">
        <div class="aui-content" id="home-main">
            <div class="aui-row aui-btn-title">
                <div class="aui-col-xs-6 aui-text-left">　扫码直播 </div>
                <div class="aui-col-xs-6 aui-text-right">
                    <a class="aui-pull-right aui-btn" tapmode onclick="goScan()">
                        <span class="aui-iconfont aui-icon-camera"></span>
                    </a>
                </div>
            </div>
            <div class="aui-row aui-searchbar">
                <div class="aui-searchbar-input aui-border-radius" tapmode>
                    <i class="aui-iconfont aui-icon-video"></i>
                    <input type="search" placeholder="以rtmp开头" id="rtmp-input">
                </div>
                <!-- <div class="aui-searchbar-cancel" tapmod onclick="doPaste()">粘贴　</div> -->
            </div>
            <div class="aui-row aui-btn-title">
                　直播模式分辨率
            </div>
            <div class="aui-row">
                <div class="aui-col-xs-4 aui-btn-fbl">
                    <div class="aui-btn aui-btn-block aui-btn-info" tapmod onclick="onChange(1,'fbl')" id="fbl1" val="720">高清<span>720p/1800kbsp</span></div>
                </div>
                <!-- <div class="aui-col-xs-4 aui-btn-fbl">
                    <div class="aui-btn aui-btn-block aui-btn-outlined" tapmod onclick="onChange(2,'fbl')" id="fbl2" val="720">高清<span>720p/2700kbsp</span></div>
                </div>
                <div class="aui-col-xs-4 aui-btn-fbl">
                    <div class="aui-btn aui-btn-block aui-btn-outlined" tapmod onclick="onChange(3,'fbl')" id="fbl3" val="1080">超清<span>1080p/3000kbsp</span></div>
                </div> -->
            </div>
            <div class="aui-row  aui-btn-title">
                　屏幕方向
            </div>
            <div class="aui-row">
                <div class="aui-col-xs-4 aui-btn-kk">
                    <div class="aui-btn aui-btn-block aui-btn-info" tapmod onclick="onChange(1,'fx')" id="fx1" val="0">竖屏</div>
                </div>
                <!-- <div class="aui-col-xs-4 aui-btn-kk">
                    <div class="aui-btn aui-btn-block aui-btn-outlined" tapmod onclick="onChange(2,'fx')" id="fx2" val="1">横屏</div>
                </div> -->
                <div class="aui-col-xs-4 aui-btn-kk">　</div>
            </div>
        </div>
        <div class="aui-btn-bot start-push">
            <div class="aui-btn aui-btn-block aui-btn-info" tapmode onclick="fnPush()">开始直播</div>
        </div>
        <div class="aui-btn-bot create-room" >
            <div class="aui-btn aui-btn-block aui-btn-info aui-btn-outlined" tapmode onclick="openFrm('creat_live')" id="lives">创建房间</div>
        </div>
    </form>

    <footer class="aui-bar aui-bar-tab" id="aui-footer">
        <div class="aui-bar-tab-item" tapmode onclick="openFrm('video_frm')">
            <i class="aui-iconfont aui-icon-video"></i>
            <div class="aui-bar-tab-label">直播中心</div>
        </div>
        <div class="aui-bar-tab-item" tapmode onclick="openFrm('my_frm')">
            <i class="aui-iconfont aui-icon-my"></i>
            <div class="aui-bar-tab-label">我的</div>
        </div>
    </footer>
</body>
<script type="text/javascript" src="../script/api.js" ></script>
<script type="text/javascript" src="../script/common.js" ></script>
<script type="text/javascript" src="../script/jquery.min.js"></script>
<script type="text/javascript">
var resolution = 720;//分辨率
var direction = 0;//屏幕方向0=默认(竖屏),1=横屏
apiready = function () {
    fixStatusBar();
    $api.css($api.byId('home-main'),'margin-top:'+headerHeight+'px;');

    api.parseTapmode();

    var viewParm = api.pageParam;
    if(typeof(viewParm.rtmp_url) != 'undefined'){
        $api.val($api.byId('rtmp-input'),viewParm.rtmp_url);
    }
    var is_login = $api.getStorage('isLogin');

    fnOpenMainFrame(is_login);
    var pushurl = $api.getStorage('pushurl');
    if (pushurl) {
      $('#lives').hide();
    }else {
      $('#lives').show();
    }
    //$api.attr($api.byId('pushurl'),'value',pushurl);

}
//切换
function onChange(id,type){
    if(type == 'fbl'){
        $api.attr($api.byId('fbl1'),'class','aui-btn aui-btn-block aui-btn-outlined');
        $api.attr($api.byId('fbl2'),'class','aui-btn aui-btn-block aui-btn-outlined');
        $api.attr($api.byId('fbl3'),'class','aui-btn aui-btn-block aui-btn-outlined');
        $api.attr($api.byId('fbl'+id),'class','aui-btn aui-btn-block aui-btn-info');
        resolution = $api.attr($api.byId('fbl'+id),'val');
    }else if(type == 'fx'){
        $api.attr($api.byId('fx1'),'class','aui-btn aui-btn-block aui-btn-outlined');
        $api.attr($api.byId('fx2'),'class','aui-btn aui-btn-block aui-btn-outlined');
        $api.attr($api.byId('fx'+id),'class','aui-btn aui-btn-block aui-btn-info');
        direction = $api.attr($api.byId('fx'+id),'val');
    }
}
//粘贴
function doPaste(){
    var clipBoard = api.require('clipBoard');
    clipBoard.get(function(ret, err) {
      if (ret) {
          $api.val($api.byId('rtmp-input'),ret.value);
          console.log(JSON.stringify(ret));
      }
    });
}
//扫码
function goScan(){
  api.openWin({
      name: 'fnscanner_frm',
      url: './fnscanner_frm.html',
      reload:true
  });
}
//开始推流
function fnPush(){
  var pushurl = $api.getStorage('pushurl');
  if (pushurl) {
    rtmp_url=pushurl;
  }else {
    rtmp_url = $api.val($api.byId('rtmp-input'));
  }
  if(rtmp_url != '' && rtmp_url != undefined && rtmp_url != null){
    if(rtmp_url.indexOf("rtmp://") == -1){
        _WXUI.alert('仅支持rtmp流');
        return ;
    }
  }
  var data = {
      rtmp_url:rtmp_url,
      resolution:resolution,
      direction:direction
  };
  openFrm('video_push_frm',data);
}
//创建房间
function fnCreateRoom(){

}
</script>
</html>
